<template>
  <el-row :gutter="20">
    <el-col :span="8">
      <!--clearable供一个X删除搜索关键字 -->
      <!--@clear="getUserList"重新获取所有的用户列表数据-->
      <el-input v-model="input" placeholder="请输入内容" clearable @clear="$emit('getUserList')" @keyup.enter.native="$emit('getUserList')" @change="change">
        <el-button slot="append" icon="el-icon-search" @click="$emit('getUserList')" />
      </el-input>
    </el-col>
    <el-col :span="4">
      <el-button type="primary" @click="$emit('changDialog', true)">添加用户</el-button>
    </el-col>
  </el-row>
</template>

<script>
export default {
  name: 'TopBar',
  props: {
    dialog: {
      type: Boolean,
      required: false
    }
  },
  data() {
    return {
      input: ''
    }
  },
  created() {},
  methods: {
    change(val) {
      // console.log(val)
      this.$emit('change', val)
    }
  }
}
</script>

<style lang='less' scoped>
</style>
